import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

// Components of business.
import { CrisisComponent } from './modules//crisis/crisis.component';
import { LoginComponent } from './login/login.component';
import { AboutComponent } from './modules//about/about.component';
import { PageNotFoundComponent } from './modules//page-not-found/page-not-found.component';
import { ComposeMessageComponent } from './compose-message/compose-message.component';



const appRoutes: Routes = [
  // common routers.
  { path: '', redirectTo: 'heroes', pathMatch: 'full' }, // 我们这里搞了一下，默认传递到这个路由，所以就打开了Heroes列表啦...
  { path: 'login', component: LoginComponent },

  // 这个路由特定了一个出口，名字叫popup,在app.component.html中.
  // 意思是：当用户点击此链接时，在路由出口popup中显示与compose路由相关联的组件。
  { path: 'compose', component: ComposeMessageComponent, outlet: 'popup' },

  // business routers.
  { path: 'crisis-center', component: CrisisComponent },
  { path: 'about', component: AboutComponent },

  // 404 routers.
  { path: '**', component: PageNotFoundComponent },
];


@NgModule({
  imports: [
    RouterModule.forRoot(appRoutes)
  ],
  exports: [
    RouterModule
  ]
})

export class AppRoutingModule { }



